// 表格
<template>
  <el-form ref="form" :model="form" :inline="true">
    <el-row
      :gutter="0"
      v-for="(row, index) in list"
      :key="index"
      style="margin-bottom: 0px"
      label-width="100px"
      label-position="top"
    >
      <el-col
        v-for="(item, indexRow) in row.elCol"
        :span="item.span ? item.span : 6"
        :key="indexRow"
      >
        <base-form-item :key="item.id">
          <!-- 输入框 输入数据绑定item.value -->
          <span>{{ item.title }}</span>
          <template v-if="item.type === 'input'">
            <el-input
              :rows="2"
              clearable
              v-model="item.value"
              :placeholder="item.placeholder"
              :maxlength="item.maxlength ? item.maxlength * 1 : ''"
            ></el-input>
          </template>
          <!-- 下拉框  输入数据绑定item.value-->
          <template v-else-if="item.type === 'select'">
            <BaseSelect :itemObj="item"></BaseSelect>
          </template>
          <!-- 单选框 输入数据绑定item.value -->
          <template v-else-if="item.type === 'radio'">
            <BaseRabio :itemObj="item"></BaseRabio>
          </template>
          <!-- 日期选择 -->
          <template v-else-if="item.type === 'datepick'">
            <BaseDatePick :itemObj="item"></BaseDatePick>
          </template>
          <!-- treeselect -->
          <template v-else-if="item.type === 'treeselect'">
            <treeselect
              v-model="item.value"
              :normalizer="item.normalizer"
              :options="delTreeChildren(item.options)"
              :multiple="item.multiple ? row.multiple : false"
              :disabled="item.disabled && !newFlag ? item.disabled : false"
              @clear="treeSelectClear"
              ref="selectTree"
              :placeholder="!item.placeholder ? '请选择' : item.placeholder"
              @select="selectTree"
            />
          </template>
        </base-form-item>
      </el-col>
    </el-row>
  </el-form>
</template>

<script>
import BaseDatePick from "./baseDatePicker.vue";
import BaseRabio from "./baseRadio.vue";
import BaseFormItem from "./baseFormItem.vue";
import BaseSelect from "./baseSelect";
export default {
  props: {
    // 列表
    list: {
      type: Array,
      default: [],
    },
  },
  data() {
    return {
      form: {},
    };
  },
  methods: {
    selectTree(node, instanceId) {
      this.$emit("selectTree", node);
    },
    treeSelectClear() {
      this.$refs.selectTree.clear();
    },
  },
  created() {
    console.log(this.list);
  },
  components: {
    BaseFormItem,
    BaseSelect,
    BaseRabio,
    BaseDatePick,
  },
};
</script>

<style scoped lang='scss'>
</style>